// 用来管理整个项目中所有的页面渲染功能：V

function listRender(box, data){
    data = Array.isArray(box) ? box : data;
    let str = ""
    data.forEach(val=>{
        str += `<div class="cont" myid="${val.id}">
                    <img src="${val.img}" alt="">
                    <p class="price">${val.price}</p>
                    <p>${val.name}</p>
                    <input type="button" value="加入购物车" class="addCart">
                </div>`;
    })
    !Array.isArray(box) && (box.innerHTML = str);
    return str;
}

export {listRender};



function cartRender(box, data, localData){
    let str = '';
    data.forEach(val1=>{
        localData.forEach(val2=>{
            if(val1.id === val2.id){
                str += 
                `<tr myid="${val2.id}">
                    <td><input type="checkbox" ${val2.check ? 'checked' : ''} class="check"></td>
                    <td><img src="${val1.img}"></td>
                    <td>${val1.name}</td>
                    <td><input class="num" type="number" value="${val2.num}"></td>
                    <td>${val2.price}</td>
                    <td class="count">${val2.price * val2.num}</td>
                    <td class="del">删除</td>
                </tr>`
            }
        })
    })
    box.innerHTML = str;
}
export {cartRender};
